import { ProCard, ProColumns, ProForm, ProFormText, ProTable } from "@ant-design/pro-components";
import { Button } from "antd";

const App:React.FC=()=>{
     interface DataType1{
        code:string,name:string,invstd:string,invstd2:string,
        munit_name:string,quantity:number,
     }
     const columns1:ProColumns<DataType1>[]=[
        {dataIndex:'code',title:'SKU编码'},{dataIndex:'name',title:'商品名称'},
        {dataIndex:'invstd',title:'包装规格'},{dataIndex:'invstd2',title:'型号'},
        {dataIndex:'munit_name',title:'计量单位'},{dataIndex:'quantity',title:'库存数量'},
     ];
     const tdata1:DataType1[]=[
        {code:'X010234',name:'超亮小象',invstd:'20*35',invstd2:'',munit_name:'只',quantity:568},
        {code:'K5982265',name:'钻石欧飞扬',invstd:'78*125',invstd2:'',munit_name:'个',quantity:900},
     ];

      interface DataType2{
        vouchcode:string,depname:string,business:string,
        quantity:number,warehouse:string,stocktime:number,
      }
      const columns2:ProColumns<DataType2>[]=[
        {dataIndex:'warehouse',title:'仓库'},{dataIndex:'quantity',title:'数量'},
        {dataIndex:'vouchcode',title:'单据号'},{dataIndex:'depname',title:'部门'},{dataIndex:'business',title:'业务员'},
        
      ];
      const tdata2:DataType2[]=[
        {warehouse:'一仓',quantity:50,vouchcode:'X202633',depname:'业务一组',business:'张琴',stocktime:3},
        {warehouse:'二仓',quantity:60,vouchcode:'X2625733',depname:'业务二组',business:'吴丹',stocktime:5},
        {warehouse:'二仓',quantity:80,vouchcode:'X202633',depname:'业务二组',business:'张琴',stocktime:10},
        {warehouse:'四仓',quantity:120,vouchcode:'',depname:'',business:'',stocktime:22},
      ];
    return <>
       <ProCard title='物料库存分析'>
            <ProForm layout="horizontal" submitter={false}>
                <ProFormText name='search' label='追溯物料编码' style={{width:300}}/>
                <Button>开始分析</Button>
            </ProForm>
            <ProTable<DataType1>
               columns={columns1}
               dataSource={tdata1}
               search={false}
               rowSelection={{
                type:'checkbox'
               }}
            />
             <ProTable<DataType2>
                search={false}
               columns={columns2}
               dataSource={tdata2}
               rowSelection={{
                type:'checkbox'
               }}
            />
       </ProCard>
    </>;
}

export default App;